
// $font-url:font_24622_qcd1qfyyr97;
// @font-face {
//   font-family: 'iconfont';  /* project id 24622 */
//   src: url('https://at.alicdn.com/t/'+$font-url+'.eot');
//   src: url('https://at.alicdn.com/t/'+$font-url+'.eot?#iefix') format('embedded-opentype'),
//   url('https://at.alicdn.com/t/'+$font-url+'.woff2') format('woff2'),
//   url('https://at.alicdn.com/t/'+$font-url+'.woff') format('woff'),
//   url('https://at.alicdn.com/t/'+$font-url+'.ttf') format('truetype'),
//   url('https://at.alicdn.com/t/'+$font-url+'.svg#iconfont') format('svg');
// }
// @import "@/static/iconfont.css";
// @import "@/static/tailwind.css";

$as-main:#FFFFFF; // 本系统的主色调

$as-black:#464646;
$as-gray:#949494;
$as-lightgray:#B1B1B1;
$as-yellow:#FCD561; // 本系统的主色调

$as-green: #00B4AB;
$as-red: #FF4242;
$as-blue: #47B6FF;
$as-orange: #FFE6A8;

$as-dart-orange: #E8A007;

// .homework{
$as-navi-bottom-height:100rpx;
// $as-navi-top: calc(var(--window-top) + var(--status-bar-height));
$as-navi-top: calc(var(--window-top));
$as-navi-bottom:calc(var(--window-bottom) + 100rpx);
 
// $as-navi-top: var(--status-bar-height)+var(--window-top);
// $as-navi-bottom:$as-navi-top+$as-navi-top;

.h1,.h2,.h3{
	color: #464646;
}
.h1-g,.h2-g,.h3-g,.h4-g,.h5-g{
	color: #949494;
}

// 作为标题 深色 加粗 较大字体
.h1,.h1-g{
	font-size: 30rpx;
}
// 作为副标题 深色 加粗 大字体
.h2,.h2-g{	
	font-size: 28rpx;
}
// 作为内容 深色 不加粗 中字体
.h3,.h3-g{
	font-size: 24rpx;
}
.h4,.h4-g{
	font-size: 22rpx;
}
.h5,.h5-g{
	font-size: 20rpx;
}

.h32{
	font-size: 32rpx;
}
/*默认为深色，次级为浅灰*/ 
.font-color-gray{
	color: $as-gray;
}
.font-color-blue{
	color: $as-blue;
}
.as-color-main{
	color: $as-main
}
.as-bgcolor-main{
	background-color: $as-main
}
.as-color-orange{
	color: $as-orange;
}
.as-default-bg-color{
	// color: #efeff4;
	background-color: #efeff4;
}
.as-color-dart-orange{
	color: $as-dart-orange;
}

// .as-orange-1{
// 	color:#FF6007
// }
// 加粗
.p{
	font-weight: 600;
}
.tint{
	color: #949494;
}


.as-bg-green{
	background-color: $as-green;
}
.as-bg-red{
	background-color: $as-red;
}
.as-bg-eee{
	background-color: #eee;
}

.w-0{
	width: 0rpx;
}
.h-0{
	height: 0rpx;
}

.flex{
	display: flex;
}
.flex-row{
	@extend .flex;
	flex-direction: row;
	// justify-content: center; // 默认居中 
}
.flex-column{
	@extend .flex;
	flex-direction: column;
	// justify-content: center; // 默认居中 
}

.flex-center{
	justify-content: center;
	align-items: center;
}

.flex-m-start{
	justify-content: flex-start;
}
.flex-m-end{
	justify-content: flex-end;
}
.flex-m-between{
	justify-content: space-between;
}
.flex-m-around{
	justify-content: space-around;
}
.flex-m-center{
	justify-content: center;
}
.flex-c-center{
	align-items: center;
}
.flex-c-start{
	align-items: flex-start;
}
.flex-c-end{
	align-items: flex-end;
}
.flex-c-stretch{
	align-items: stretch;
}
.flex-c-baseline{
	align-items: baseline;
}

.flex-wrap{
	flex-wrap:wrap; // 换行
}
.flex-grow-1{
	flex-grow:1; //放大比例，默认为0，即如果存在剩余空间，也不放大。1则放大
}
.flex-shrink-0{
	flex-shrink:0; // 缩小比例，默认为1，即如果空间不足，该项目将缩小。0 则不缩小
}
.flex-self-start{
	align-self: flex-start;
}


.flex1{
	flex: 0 1 auto;
}
.flex-align-self-stretch{
	align-self: stretch;
}


.u-relative,
.u-rela {
	position: relative;
}

.u-absolute,
.u-abso {
	position: absolute;
}

// nvue不能用标签命名样式，不能放在微信组件中，否则微信开发工具会报警告，无法使用标签名当做选择器
/* #ifndef APP-NVUE */
image {
	display: inline-block;
}

// 在weex，也即nvue中，所有元素默认为border-box
view,
text {
	box-sizing: border-box;
}
/* #endif */

.u-font-xs {
	font-size: 22rpx;
}

.u-font-sm {
	font-size: 26rpx;
}

.u-font-md {
	font-size: 28rpx;
}

.u-font-lg {
	font-size: 30rpx;
}

.u-font-xl {
	font-size: 34rpx;
}

.u-flex {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	align-items: center;
}

.u-flex-wrap {
	flex-wrap: wrap;
}

.u-flex-nowrap {
	flex-wrap: nowrap;
}

.u-col-center {
	align-items: center;
}

.u-col-top {
	align-items: flex-start;
}

.u-col-bottom {
	align-items: flex-end;
}
.u-col-stretch {
	align-items: stretch;
}
 

.u-row-center {
	justify-content: center;
}

.u-row-left {
	justify-content: flex-start;
}

.u-row-right {
	justify-content: flex-end;
}

.u-row-between {
	justify-content: space-between;
}

.u-row-around {
	justify-content: space-around;
}

.u-text-left {
	text-align: left;
}

.u-text-center {
	text-align: center;
}

.u-text-right {
	text-align: right;
}

.u-flex-col {
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: column;
}
.u-column {
	flex-direction: column;
}
// 定义flex等分
@for $i from 0 through 12 {
	.u-flex-#{$i} {
		flex: $i;
	}
}

// 定义字体(px)单位，小于20都为px单位字体
@for $i from 9 to 20 {
	.u-font-#{$i} {
		font-size: $i + px;
	}
}

// 定义字体(rpx)单位，大于或等于20的都为rpx单位字体
@for $i from 20 through 40 {
	.u-font-#{$i} {
		font-size: $i + rpx;
	}
}
.u-font-60 {
		font-size: 60 rpx;
}
.u-font-80 {
		font-size: 80 rpx;
}

// 定义 宽度
@for $i from 1 through 20 {
	.u-width-#{$i}0 {
		width: $i*10 + rpx;
	}
}
// 定义 高度
@for $i from 1 through 20 {
	.u-height-#{$i}0 {
		height: $i*10 + rpx;
	}
}

// 定义 圆角度数
@for $i from 1 through 10 {
	.u-border-radius-#{$i}0 {
		border-radius: $i*10 + rpx;
	}
}
// 定义 内部 各个view text image 之间的距离
@for $i from 1 through 10 {
	.u-c-padding-#{$i}0 {
		>view,text,image{
			margin: $i*10 + rpx;
		}
	}
}

// 定义内外边距，历遍1-80
@for $i from 0 through 80 {
	// 只要双数和能被5除尽的数
	@if $i % 2 == 0 or $i % 5 == 0 {
		// 得出：u-margin-30或者u-m-30
		.u-margin-#{$i}, .u-m-#{$i} {
			margin: $i + rpx!important;
		}
		
		// 得出：u-padding-30或者u-p-30
		.u-padding-#{$i}, .u-p-#{$i} {
			padding: $i + rpx!important;
		}
		
		@each $short, $long in l left, t top, r right, b bottom {
			// 缩写版，结果如： u-m-l-30
			// 定义外边距
			.u-m-#{$short}-#{$i} {
				margin-#{$long}: $i + rpx!important;
			}
			
			// 定义内边距
			.u-p-#{$short}-#{$i} {
				padding-#{$long}: $i + rpx!important;
			}
			
			// 完整版，结果如：u-margin-left-30
			// 定义外边距
			.u-margin-#{$long}-#{$i} {
				margin-#{$long}: $i + rpx!important;
			}
			
			// 定义内边距
			.u-padding-#{$long}-#{$i} {
				padding-#{$long}: $i + rpx!important;
			}
		}
	}
}

// 重置nvue的默认关于flex的样式
.u-reset-nvue {
	flex-direction: row;
	align-items: center;
}

// .nowrap{
// 	flex-wrap: nowrap;
// }
// .wrap{
// 	flex-wrap: wrap;
// }
.white-wrap{
	white-space:break-all;
	word-wrap: break-word;
}
.white-nowrap{
	white-space: nowrap;
}

.full-page{
	display: flex;
	flex: 1;
	flex-direction: column;
	// align-items: stretch;
	background-color: #efeff4;
	padding:0px;
}

.normal-page{
	display: flex;
	flex: 1;
	flex-direction: column;
	background-color: #efeff4;
	padding:20px;
}

.cell-margin{
	margin: 10rpx 32rpx;
}
.cell-margin-bottom{
	margin: 0rpx 0rpx 30rpx 0rpx;
}
.cell-padding{
	padding: 20rpx 28rpx;
}

 
// 底部导航栏 的站位区域
.tabbar-place{
	height: 100rpx;
	padding: 0rpx 40rpx;
}
.tabbar{
	@extend .flex-row,.flex-m-between,.flex-c-center,.tabbar-place;
	align-items: center;
	position: fixed;
	// top: 0rpx;
	bottom: 0rpx;
	left: 0rpx;
	right: 0rpx;
	// height: 100rpx;
	
	background-color: white;
	text{
		@extend .h2;
	}
}

//拟态效果  
.neumorphism{
	background: #FFFFFF;
	box-shadow: 0px 8px 24px 0px rgba(0, 0, 0, 0.1);
	border-radius:16rpx;
	color:#0D0E10;
}
.nt-card{
	margin: 32rpx;
	padding: 28rpx;
	background: #F8F8F8;
	box-shadow: 6rpx 6rpx 16rpx 0rpx rgba(209, 205, 199, 0.5), 2rpx 2rpx 2rpx 0rpx #FFFFFF;
	border-radius: 14rpx;
	border: 2rpx solid;
	border-image: linear-gradient(161deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1)) 0 0;
	
}
.ns-card{
	@extend .neumorphism;
	// margin: 10rpx 0rpx;
}
.ns-card-list{
	@extend .neumorphism;
	&:last-child{
		border-bottom: 0rpx;
	}
	&:first-child{
		border-top: 0rpx;
	}
}


// .icon-text{
// 	font-family: iconfont;
// }

// 底部
.bottom-border{
	border-bottom: 0.1rpx solid;
	border-color: #e6e6e6;
	&:last-child{
		border-bottom: 0rpx;
	}
}

// 带边框的文本  
.border-text{
	@extend .flex-row;
	@extend .flex-center;
	border: 0.1rpx solid;
	border-radius:24rpx;
	padding-left: 16rpx;
	padding-right: 16rpx;
	border-color: #e5e5e5;
	font-size: 24rpx;
	color: #606060;
}
// 圆角 浅橘底色的文字 
.orange-bg{
	// @extend .flex-row;
	// @extend .flex-center;
	padding: 4rpx 16rpx;
	// margin: 0rpx 20rpx;
	
	background-color: $as-orange;
	border-radius: 8rpx;
}

// 分组标题
.group-title{
	@extend .h2-g;
	margin: 32rpx 32rpx 0rpx 32rpx;
}

.img-40{
	width: 40rpx;
	height: 40rpx;
}

.img-80{
	width: 80rpx;
	height: 80rpx;
}

// .cell{
// 		// @extend .bottom-border,.h2;
// 	// padding: 36rpx 16rpx;
// 	// white-space:nowrap;
// 	overflow:hidden;
// 	text-overflow:ellipsis;
	
// }
.flex10{
	flex: 0 0 10%;
}
.flex15{
	flex: 0 0 15%;
}
.flex20{
	flex: 0 0 20%;
	// overflow: hidden;
	height: 100%;
}
.flex25{
	flex: 0 0 25%;
}
.flex30{
	flex: 0 0 30%;
}
.flex40{
	flex: 0 0 40%;
}
.fw{
	font-weight: bold;
}
.f32{
	font-size: 32rpx;
}
.as-charts{
	margin: 16rpx 0rpx;
	padding: 20rpx 32rpx 20rpx 20rpx;
	background-color: #ffffff;
	height: 540rpx;

	position: relative;
	>view{
		margin-bottom: 12rpx;
	}
}
.as-list{
	padding:20rpx 32rpx;
	background-color: #ffffff;
	>view{
		margin-bottom: 16rpx;
		// padding: 36rpx 16rpx;
	}
	text{
		text-align: center;
	}
	.info-row{
		padding: 20rpx 10rpx;
		>text{
			padding: 30rpx 6rpx;
			white-space: pre-wrap;
			overflow: auto;
		}
		
	}
}

.as-cell{
	padding:20rpx 32rpx;
	background-color: #ffffff;
	// >text{
	// 	margin-bottom: 30rpx;
	// }
	>view{
		margin-top: 16rpx;
	}
	.info-row{
		>text{
			padding: 16rpx 16rpx;
		}
	}
	
}
.border-picker{
	height: 48rpx;
	// margin: 0rpx 20rpx;
	padding: 0rpx 20rpx;
	border-radius: 24rpx;
	background-color: #EEEEEE;
	
}

.chart-empty-tip{
	// position: absolute;
	// top:220rpx;
	// left: 100rpx;
	// right: 100rpx;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
	height:100%;
	background-color: #FFFFFF;
	color: #cccccc;
	font-size: 38rpx;
	text-align: center;
}

.scroll-view_H {
		white-space: nowrap;
		width: 100%;
		height: 460rpx;
		overflow-x: scroll;
	}
	
	.scroll-view-item_H {
		display: inline-block;
	}
	
	.lvllabel{
		min-width: 100rpx;
	}
	.head-title{
		padding:0 12rpx;
	}
.statistics-wrap{
	width: 100%;
	overflow: hidden;
	height: 100vh;
	.statistics-top{
		width: 100%;
		position: fixed;
		top:0;
		left:0;
	}
}
.head-title .h2{
		line-height: 40rpx;
	}